/*
 * @Description: 
 * @Author: 葛玉根
 * @Date: 2021-03-06 09:53:54
 * @LastEditTime: 2021-03-08 16:20:43
 * @LastEditors: 葛玉根
 */
import React, { useEffect } from 'react';
import './index.less';
import { Table, Space, Popconfirm, message, Button, ConfigProvider } from 'antd';
import zhCN from 'antd/lib/locale/zh_CN';
import { useDispatch, useSelector, ClassModelState} from 'umi';

import Add from './components/Add'
import Edit from './components/Edit'
export default function Page() {
    const dispatch = useDispatch()
    let { data } = useSelector((model: { classAdministration: ClassModelState }) => model.classAdministration)
    useEffect(() => {
        dispatch({
            type: 'classAdministration/getClassData'
        })
    }, [])
    function confirm(text: any) {
        dispatch({
            type: 'classAdministration/deleClass',
            payload: {
                grade_id: text.grade_id
            }
        })
        message.success('删除成功');
    }

    function cancel() {
        message.error('删除失败');
    }

    const columns = [
        {
            title: '班级名',
            dataIndex: 'grade_name',
            key: 'grade_id',
        },
        {
            title: '课程表',
            dataIndex: 'subject_text',
            key: 'grade_id',
        },
        {
            title: '教室号',
            dataIndex: 'room_text',
            key: 'grade_id',
        },
        {
            title: '操作',
            key: 'action',
            render: (text: any, record: any) => (
                <Space size="middle">
                    <Edit text={text} grade_id={record.grade_id}></Edit>
                    <Popconfirm
                        title="确定删除班级吗?"
                        onConfirm={()=>{confirm(text)}}
                        onCancel={cancel}
                        okText="确定"
                        cancelText="取消"
                    >
                        <Button type="link" style={{ color: '#cccccc' }}>删除</Button>
                    </Popconfirm>
                </Space>
            ),
        },
    ];
    return (
        <div className="a">
            <h1 className="classTitle">班级管理</h1>
            <div className="classBox">
                <div className="addClass">
                    <Add></Add>
                </div>
                {
                    <ConfigProvider locale={zhCN}>
                        <Table dataSource={data} columns={columns} rowKey={(record) => record.room_id} />
                    </ConfigProvider>
                }
            </div>
        </div>
    );
}